<script setup>
import {inject, watchEffect, ref} from "vue";

const {productList} = inject('homeProduct')

// 轮播书籍商品图片列表
const images = ref([])
watchEffect(() => {
  // 取前5个书籍商品的商品图片
  images.value = productList.value.slice(0, 5).map(
      item => item.imgs[0].img
  )
})
</script>

<template>
  <van-swipe :autoplay="3000" lazy-render height="150">
    <van-swipe-item v-for="image in images">
      <img class="w-full h-full object-cover" :src="image"  alt="轮播图片"/>
    </van-swipe-item>
  </van-swipe>
</template>

<style scoped lang="scss">

</style>